<template>
  <div>
    <div v-if="type.stylesType !== 3"  class="type-one">
      <div
        v-for="(item,index) in type.imgUrls"
        :key="index"
        @click="feileidetail(item)"
      >
        <section>
          <img :src="item.src">
        </section>
        <div>{{item.substance}}</div>
      </div>
    </div>
    <div v-if="type.stylesType === 3" class="type-one">
      <div
        v-for="(item,index) in type.iconUrls"
        :key="index"
        @click="feileidetail(item)"
      >
        <section>
          <img :src="item.src" style="border-radius: 50%;">
        </section>
        <div>{{item.substance}}</div>
      </div>
    </div>
  </div>
</template>

<script>
// iconUrls === stylesType ===3
// imgUrls !== stylesType !==3
export default {
  props: ['type'],
  created () {
    // console.log(this.type, 1233123)
  },
  methods: {
    feileidetail (item) {
      // console.log(item.param.link_url)
      if (item.param.link_url) {
        if (item.param.link_url === 'one_money' || item.param.link_url === 'up_sort' || item.param.link_url === 'success') {
          this.$router.push({
            path: '/other',
            query: {
              link: item.param.link_url
            }
          })
        } else {
          console.log(item.param.link_url)
          this.$router.push({
            path: item.param.link_url
          })
        }
      }

      // console.log(item.param)
      // this.$emit('feileidetail', item)
    }
  },
  data () {
    return {
      audiostate: false
    }
  },
  components: {

  }
}
</script>
<style lang="less" scoped>
.type-one {
  width: calc(100vw * 686 / 750);
  display: flex;
  margin: 0 auto;
  margin-bottom:  calc(100vw * 30 / 750);
  div {
    flex: 1;
    section {
      margin: 0 auto;
      text-align: center;
      width: 36px;
      height: 36px;
      margin-bottom: 10px;
      img {
        width: 100%;
        height: 100%;
      }
    }
    div {
      text-align: center;
    }
  }
}
</style>
